<template>
    <div class="f"
         v-loading="loading"
         element-loading-text="正在操作数据库，请稍候...">
        <div>
            <el-card class="data-card">
                <div slot="header" class="clearfix">
                    <span>备份</span>
                </div>
                <div>
                    <p>此操作将备份数据资源！！！</p>
                </div>
                <div class="bt">
                    <el-button type="primary" @click="backup">备份</el-button>
                </div>
            </el-card>
        </div>
        <div>
            <el-card class="data-card">
                <div slot="header" class="clearfix">
                    <span>恢复</span>
                </div>
                <div>
                    <p>此操作将覆盖数据库数据！！！</p>
                </div>
                <div class="bt">
                    <el-button type="primary" @click="showdialog">恢复</el-button>
                </div>
            </el-card>
        </div>
        <div>
            <el-card class="data-card">
                <div slot="header" class="clearfix">
                    <span>初始化</span>
                </div>
                <div>
                    <p>此操作将初始化系统，请谨慎操作！！！</p>
                </div>
                <div class="bt">
                    <el-button type="danger" @click="open">初始化</el-button>
                </div>
            </el-card>
        </div>
        <el-dialog title="备份记录" :visible.sync="flag">
            <el-table :data="sql">
                <el-table-column property="key" label="文件名称" width="300"></el-table-column>
                <el-table-column property="lastModified" label="备份时间" width="300"></el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button
                                size="mini"
                                @click="handleEdit(scope.$index, scope.row)">恢复
                        </el-button>
                        <el-button
                                size="mini"
                                type="danger"
                                @click="handleDelete(scope.$index, scope.row)">删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>
    </div>

</template>

<script>
    import {Message} from "element-ui";

    export default {
        name: "SysData",
        data(){
            return{
                sql:[],
                flag:false,
                loading:false,
                infopass:{
                    password:''
                }
            }
        },
        methods:{
            handleEdit(index, data){
                this.loading=true;
                this.flag=false;
                this.postRequest("/system/data/recovery",data).then(resp=>{
                    this.loading=false;
                    this.getRequest("/loginout");
                    Message.error({message:'系统已经恢复请重新登录！！！！'})
                })
            },
            handleDelete(index, data){
                this.postRequest("/system/data/delete",data).then(resp=>{
                    this.showdialog();
                })
            },
            showdialog(){
                this.getRequest("/system/data/list").then(resp=>{
                    if (resp.data){
                        this.flag=true;
                        this.sql = resp.data;
                    }
                })
            },
            backup(){
                this.loading=true;
                this.getRequest("/system/data/").then(resp=>{
                    if (resp){
                        this.loading=false;
                    }
                })
            },
            open() {
                this.$prompt('温馨提示：初始化后用户名：admin,密码：123!\n请输入密码：', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                }).then(({ value }) => {
                    this.loading=true;
                    this.getRequest("/system/data/initSystem?password="+value).then(resp=>{
                        this.loading=false;
                        this.getRequest("/loginout");
                        Message.error({message:'系统已经初始化请重新登录！！！！'})
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消输入'
                    });
                });
            }
        }
    }
</script>

<style>
    .f{
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
    }
    .data-card{
        width: 400px;
        margin-top: 20px;
    }
    .bt{
        display: flex;
        justify-content: flex-end
    }
</style>